<template>
  <div class="demo">
    <div class="demo-title">隐藏已选择选项</div>
    <div class="demo-content">
      <Select
        v-model:value="selectedItems"
        mode="multiple"
        placeholder="Inserted are removed"
        style="width: 100%"
        :options="filteredOptions.map((item) => ({ value: item }))"
      />
    </div>
  </div>
</template>

<script lang="ts" setup>
  import { computed, ref } from 'vue';
  import Select from '@sscd/select';
  const OPTIONS = ['Apples', 'Nails', 'Bananas', 'Helicopters'];
  const selectedItems = ref<string[]>([]);
  const filteredOptions = computed(() => OPTIONS.filter((o) => !selectedItems.value.includes(o)));
</script>
